{% extends "base.html" %}

{% block title %}文档批量替换{% endblock %}

{% block content %}
<div class="row">
    <div class="col-lg-8 mx-auto">
        <h2 class="mb-4">
            <i class="fas fa-edit text-warning"></i> 文档批量替换工具
        </h2>
        
        <div class="card">
            <div class="card-body">
                <form id="replaceForm" enctype="multipart/form-data">
                    <div class="mb-3">
                        <label class="form-label">选择文档 <span class="text-danger">*</span></label>
                        
                        <div class="btn-group w-100 mb-2" role="group">
                            <input type="radio" class="btn-check" name="uploadMode" id="uploadFiles" value="files" checked>
                            <label class="btn btn-outline-primary" for="uploadFiles">
                                <i class="fas fa-file"></i> 选择文件
                            </label>
                            
                            <input type="radio" class="btn-check" name="uploadMode" id="uploadFolder" value="folder">
                            <label class="btn btn-outline-primary" for="uploadFolder">
                                <i class="fas fa-folder"></i> 选择文件夹
                            </label>
                        </div>
                        
                        <input type="file" class="form-control" id="docFiles" name="files" accept=".docx" multiple required>
                        <input type="file" class="form-control d-none" id="docFolder" name="folder" webkitdirectory directory multiple>
                        
                        <div class="form-text">仅支持Word文档(.docx)</div>
                    </div>
                    
                    <div id="fileList" class="mb-3"></div>
                    
                    <div class="mb-3">
                        <label class="form-label">替换模式 <span class="text-danger">*</span></label>
                        <div class="btn-group w-100 mb-2" role="group">
                            <input type="radio" class="btn-check" name="replaceMode" id="singleReplace" value="single" checked>
                            <label class="btn btn-outline-success" for="singleReplace">
                                <i class="fas fa-exchange-alt"></i> 单条替换
                            </label>
                            
                            <input type="radio" class="btn-check" name="replaceMode" id="batchRules" value="batch">
                            <label class="btn btn-outline-success" for="batchRules">
                                <i class="fas fa-list"></i> 批量替换规则
                            </label>
                        </div>
                    </div>
                    
                    <!-- 单条替换模式 -->
                    <div id="singleReplacePanel">
                    <div class="mb-3">
                        <label for="findText" class="form-label">查找内容 <span class="text-danger">*</span></label>
                            <input type="text" class="form-control" id="findText" name="find_text">
                    </div>
                    
                    <div class="mb-3">
                        <label for="replaceText" class="form-label">替换为 <span class="text-danger">*</span></label>
                            <input type="text" class="form-control" id="replaceText" name="replace_text">
                        </div>
                    </div>
                    
                    <!-- 批量替换规则模式 -->
                    <div id="batchRulesPanel" class="d-none">
                        <div class="mb-3">
                            <label for="rulesFile" class="form-label">
                                替换规则文件 
                                <span id="rulesFileRequired" class="text-danger">*</span>
                                <span id="rulesAutoLoaded" class="badge bg-success ms-2 d-none">
                                    <i class="fas fa-check"></i> 已自动加载
                                </span>
                            </label>
                            <input type="file" class="form-control" id="rulesFile" name="rules_file" accept=".txt">
                            <div class="form-text">
                                <span id="rulesFileHint">
                                上传txt文件，每行一条替换规则，格式：查找内容:替换内容
                                <br>示例：
                                <code>旧文本:新文本</code><br>
                                <code>错误词:正确词</code>
                                    <br><small class="text-info">
                                        💡 提示：或选择包含"0_过程文档批量替换信息.txt"的文件夹自动加载规则
                                    </small>
                                </span>
                                <span id="rulesAutoLoadedHint" class="d-none text-success">
                                    <i class="fas fa-check-circle"></i> 
                                    <strong>规则已从文件夹中自动加载</strong>，您可以直接提交，或点击下方"编辑规则"修改。
                                    <br>如需重新选择规则文件，可在此上传新的规则文件。
                                </span>
                            </div>
                        </div>
                        
                        <div id="rulesPreview" class="mb-3"></div>
                    </div>
                    
                    <div class="mb-3 form-check">
                        <input type="checkbox" class="form-check-input" id="useRegex" name="use_regex">
                        <label class="form-check-label" for="useRegex">
                            使用正则表达式
                            <small class="text-muted">(高级功能)</small>
                        </label>
                    </div>
                    
                    <div class="mb-3 form-check">
                        <input type="checkbox" class="form-check-input" id="caseSensitive" name="case_sensitive" checked>
                        <label class="form-check-label" for="caseSensitive">
                            区分大小写
                        </label>
                    </div>
                    
                    <div class="d-grid gap-2">
                        <button type="submit" class="btn btn-warning btn-lg">
                            <i class="fas fa-sync-alt"></i> 开始替换
                        </button>
                    </div>
                </form>
            </div>
        </div>
        
        <div id="resultMessage" class="mt-3"></div>
        
        <div id="resultDetails" class="mt-3"></div>
    </div>
</div>
{% endblock %}

{% block extra_js %}
<script>
// 配置API URL（使用应用前缀）
window.DOC_REPLACE_URLS = {
    upload: '{{ url_for("tools.upload_replace_files") }}',
    replace: '{{ url_for("tools.batch_replace") }}',
    downloadFile: '{{ app_prefix }}/tools/download-batch-file',
    downloadBatch: '{{ app_prefix }}/tools/download-batch'
};
</script>
<script src="{{ url_for('static', filename='js/doc_replace.js') }}"></script>
{% endblock %}
